<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>KISSY Switchable</title>
<link rel="shortcut icon" href="../../../kissy-dpl/base/assets/favicon.ico"/>
<link rel="stylesheet" href="../../../kissy-dpl/base/assets/reset.css"/>
<link rel="stylesheet" href="../../../kissy-dpl/base/assets/kissy-docs.css"/>

<link rel="stylesheet" href="../../../kissy-dpl/base/build/css/loading.css"/>
<link rel="stylesheet" href="../../../kissy-dpl/base/build/css/form.css"/>

<script src="../../build/kissy.js"></script>
<script src="../../../kissy-dpl/base/assets/kissy-docs.js"></script>
</head>
<body>
<div id="header">
    <h1 class="logo"><a alt="KISSY" href="http://kissyui.com/"><img src="../../../kissy-dpl/base/assets/logo.png"/></a></h1>
    <div class="sub-title">Switchable</div>
    <ul class="navigation">
        <li><a href="http://blog.kissyui.com/">博客</a></li>
        <li><a href="http://github.com/kissyteam">源码</a></li>
    </ul>

</div>
<div id="content" class="form">
    <div class="s-crumbs">
        <span>当前位置：</span>
        <a href="http://kissyui.com/">KISSY</a>
        <a href="http://docs.kissyui.com/docs/html/api/component/switchable/">Switchable</a>
        <span>Demo</span>
    </div>
    <pre class="s-section">
Switchable 组件包含 Tabs, Slide, Carousel, Accordion 这几个子组件.
</pre>

    <style>
        .s-section dt {
            margin: 10px 0;
        }
        .s-section dd {
            margin-left: 20px;
        }
    </style>
    <dl class="s-section">
        <dt class="s-title">S.Tabs:</dt>
        <dd>- <a href="demo/tabs.html">普通标签页</a></dd>
        <dd>- <a href="http://docs.kissyui.com/docs/html/api/component/switchable/tabs.html">API文档</a></dd>

        <dt class="s-title">S.Slide:</dt>
        <dd>- <a href="demo/slide.html#demo2">淘宝首页卡盘</a></dd>
        <dd>- <a href="demo/slide.html#demo3">右侧导航卡盘</a></dd>
        <dd>- <a href="demo/slide.html#demo5">滚动新闻条</a></dd>
        <dd>- <a href="demo/slide.html#slideFocus">组合效果</a></dd>
        <dd>- <a href="http://docs.kissyui.com/docs/html/api/component/switchable/slide.html">API文档</a></dd>

        <dt class="s-title">S.Carousel:</dt>
        <dd>- <a href="demo/carousel.html#demo4">普通旋转木马</a></dd>
        <dd>- <a href="demo/carousel.html#J_TinySlide">首页旋转木马</a></dd>
        <dd>- <a href="http://docs.kissyui.com/docs/html/api/component/switchable/carousel.html">API文档</a></dd>

        <dt class="s-title">S.Accordion:</dt>
        <dd>- <a href="demo/accordion.html">手风琴</a></dd>
        <dd>- <a href="http://docs.kissyui.com/docs/html/api/component/switchable/accordion.html">API文档</a></dd>

    </dl>
</div>
</body>
</html>
